SlideShare a Scribd company logo
1 of 31
Web* / Interactivity
Web* / Interactivity
Ten Commandments
Web* / Interactivity
Ten Commandments
Photosynth & Web Technologies...
Web* / Interactivity
Ten Commandments
Photosynth & Web Technologies...
Web* / Interactivity
Ten Commandments
Photosynth & Web Technologies...
Web* / Interactivity
Ten Commandments
Photosynth & Web Technologies...
Check it out...
Check it out...
EtherPad
Check it out...
EtherPad
Kuler
Check it out...
EtherPad
Kuler
Eyeborg
Check it out...
EtherPad
Kuler
Eyeborg
10 Commandments
10 Commandments


Thou shalt not abuse Flash.
10 Commandments


Thou shalt not abuse Flash.
Thou shalt not hide content . (pop-ups, obscure the
page, full page ads)
10 Commandments


Thou shalt not abuse Flash.
Thou shalt not hide content . (pop-ups, obscure the
page, full page ads)
Thou shall not clutter. (have a coherent structure,
amazon have navigation as a top priority, with a
hierarchy structure.)
Thou shall not over use glassy reflections.
Thou shall not over use glassy reflections.
Thou shall not name your Web 2.0 company
with an unnecessary surplus or dearth of
vowels. (superfluous number or deleted
vowels, will date the name. i.e Meebo, Beebo,
Flickr...)
Thou shall not over use glassy reflections.
Thou shall not name your Web 2.0 company
with an unnecessary surplus or dearth of
vowels. (superfluous number or deleted
vowels, will date the name. i.e Meebo, Beebo,
Flickr...)
Thou shalt worship at the alter of typography.
Thou shalt create
immersive experiences.
(compel users to return!)
Thou shalt create
immersive experiences.
(compel users to return!)
Thou shalt be social.
Thou shalt create
immersive experiences.
(compel users to return!)
Thou shalt be social.
Thou shalt embrace proven
technologies. (Wiki,
YouTube, FB are daily life
they are familiar, makes it
easier to connect to users.)
Thou shalt make content king.
Even if this slogan is old, it still
stands. Unique website
content...
Beauty can’t make up for empty.
Dreamweaver recap...

Define your site
Page Settings
Tables
Layers
Links
Images
Web Technologies...
Let’s start to think about Web Technologies...
Starting with Photosynth
Blaise Aguera y Arcas
...leads a dazzling demo of Photosynth, software that could transform the way
we look at digital images. Using still photos culled from the Web, Photosynth
builds breathtaking dreamscapes and lets us navigate them.
Planning / designing...
How do we plan an iPhone app?
What features will an app for the BA Graphics couse
need?

Will it be a general course information app?

Will it be a showcase of the best work from the
course?
Work in 2 groups to plan all features that you would
like.

Initial brainstorming so all ideas should be written down
at this stage - not discussed or rejected.
Planning

Planning and Researching...
If I hand your plan to someone else, would they be able
to design it?
Page Layout, Font choices, HEX codes, Navigation
Similar apps researched? Random apps?
Target Audience? Who will use this?

More Related Content

What's hot

HTML5 for Web Designers
HTML5 for Web DesignersHTML5 for Web Designers
HTML5 for Web DesignersGoodbytes
 
A New Hope – the web strikes back
A New Hope – the web strikes backA New Hope – the web strikes back
A New Hope – the web strikes backChristian Heilmann
 
New Rules of The Responsive Web
New Rules of The Responsive WebNew Rules of The Responsive Web
New Rules of The Responsive WebMatt Carver
 
Building Mobile Websites
Building Mobile WebsitesBuilding Mobile Websites
Building Mobile WebsitesSachin Khosla
 
Professional web development with libraries
Professional web development with librariesProfessional web development with libraries
Professional web development with librariesChristian Heilmann
 
[html5tx] Adaptive Images in Responsive Web Design
[html5tx] Adaptive Images in Responsive Web Design[html5tx] Adaptive Images in Responsive Web Design
[html5tx] Adaptive Images in Responsive Web DesignChristopher Schmitt
 
Finite Incatatem - Accessibility is not black magic
Finite Incatatem - Accessibility is not black magicFinite Incatatem - Accessibility is not black magic
Finite Incatatem - Accessibility is not black magicChristian Heilmann
 
PersonalBlogs_AgarwalP
PersonalBlogs_AgarwalPPersonalBlogs_AgarwalP
PersonalBlogs_AgarwalPpuneet1988
 
Georgia Tech hacking Accessibility
Georgia Tech hacking AccessibilityGeorgia Tech hacking Accessibility
Georgia Tech hacking AccessibilityChristian Heilmann
 
ALSC Web 2.0: The Interactive Web
ALSC Web 2.0: The Interactive WebALSC Web 2.0: The Interactive Web
ALSC Web 2.0: The Interactive WebBeth Gallaway
 
Beyond VoiceOver: making iOS apps accessible
Beyond VoiceOver: making iOS apps accessibleBeyond VoiceOver: making iOS apps accessible
Beyond VoiceOver: making iOS apps accessibleSally Shepard
 
Tools that help and speed up RWD dev
Tools that help  and speed up RWD devTools that help  and speed up RWD dev
Tools that help and speed up RWD devMatjaž Korošec
 
Mind the Gap - State of the Browser 2015
Mind the Gap - State of the Browser 2015Mind the Gap - State of the Browser 2015
Mind the Gap - State of the Browser 2015Christian Heilmann
 
Bootstrap tutorial
Bootstrap tutorialBootstrap tutorial
Bootstrap tutorialASAD RAZA
 
Professionalpresenationslideshow
ProfessionalpresenationslideshowProfessionalpresenationslideshow
ProfessionalpresenationslideshowArtie Edwards
 

What's hot (20)

HTML5 for Web Designers
HTML5 for Web DesignersHTML5 for Web Designers
HTML5 for Web Designers
 
Drupal intro for Symfony developers
Drupal intro for Symfony developersDrupal intro for Symfony developers
Drupal intro for Symfony developers
 
A New Hope – the web strikes back
A New Hope – the web strikes backA New Hope – the web strikes back
A New Hope – the web strikes back
 
Mac basics
Mac basicsMac basics
Mac basics
 
New Rules of The Responsive Web
New Rules of The Responsive WebNew Rules of The Responsive Web
New Rules of The Responsive Web
 
Building Mobile Websites
Building Mobile WebsitesBuilding Mobile Websites
Building Mobile Websites
 
Professional web development with libraries
Professional web development with librariesProfessional web development with libraries
Professional web development with libraries
 
[html5tx] Adaptive Images in Responsive Web Design
[html5tx] Adaptive Images in Responsive Web Design[html5tx] Adaptive Images in Responsive Web Design
[html5tx] Adaptive Images in Responsive Web Design
 
Finite Incatatem - Accessibility is not black magic
Finite Incatatem - Accessibility is not black magicFinite Incatatem - Accessibility is not black magic
Finite Incatatem - Accessibility is not black magic
 
PersonalBlogs_AgarwalP
PersonalBlogs_AgarwalPPersonalBlogs_AgarwalP
PersonalBlogs_AgarwalP
 
Rtyhujikl;
Rtyhujikl;Rtyhujikl;
Rtyhujikl;
 
Georgia Tech hacking Accessibility
Georgia Tech hacking AccessibilityGeorgia Tech hacking Accessibility
Georgia Tech hacking Accessibility
 
ALSC Web 2.0: The Interactive Web
ALSC Web 2.0: The Interactive WebALSC Web 2.0: The Interactive Web
ALSC Web 2.0: The Interactive Web
 
Beyond VoiceOver: making iOS apps accessible
Beyond VoiceOver: making iOS apps accessibleBeyond VoiceOver: making iOS apps accessible
Beyond VoiceOver: making iOS apps accessible
 
Practical, Free And Low Cost Tools You Can Use
Practical, Free And Low Cost Tools You Can UsePractical, Free And Low Cost Tools You Can Use
Practical, Free And Low Cost Tools You Can Use
 
Tools that help and speed up RWD dev
Tools that help  and speed up RWD devTools that help  and speed up RWD dev
Tools that help and speed up RWD dev
 
BETTER THAN GOOGLE
BETTER THAN GOOGLEBETTER THAN GOOGLE
BETTER THAN GOOGLE
 
Mind the Gap - State of the Browser 2015
Mind the Gap - State of the Browser 2015Mind the Gap - State of the Browser 2015
Mind the Gap - State of the Browser 2015
 
Bootstrap tutorial
Bootstrap tutorialBootstrap tutorial
Bootstrap tutorial
 
Professionalpresenationslideshow
ProfessionalpresenationslideshowProfessionalpresenationslideshow
Professionalpresenationslideshow
 

Similar to Week5 BA

Web valley talk - usability, visualization and mobile app development
Web valley talk - usability, visualization and mobile app developmentWeb valley talk - usability, visualization and mobile app development
Web valley talk - usability, visualization and mobile app developmentEamonn Maguire
 
<img src="../i/r_14.png" />
<img src="../i/r_14.png" /><img src="../i/r_14.png" />
<img src="../i/r_14.png" />tutorialsruby
 
wexarts.org iPhone Project: Developer Documentation
wexarts.org iPhone Project: Developer Documentationwexarts.org iPhone Project: Developer Documentation
wexarts.org iPhone Project: Developer Documentationtutorialsruby
 
Introduction to Flash
Introduction to FlashIntroduction to Flash
Introduction to FlashKateknight
 
Eye candy for your iPhone
Eye candy for your iPhoneEye candy for your iPhone
Eye candy for your iPhoneBrian Shim
 
Responsive web design & mobile web development - a technical and business app...
Responsive web design & mobile web development - a technical and business app...Responsive web design & mobile web development - a technical and business app...
Responsive web design & mobile web development - a technical and business app...Atos_Worldline
 
Skill Session - Web Multi Device
Skill Session - Web Multi DeviceSkill Session - Web Multi Device
Skill Session - Web Multi Devicefilirom1
 
10 Simple Rules for Making My Site Accessible
10 Simple Rules for Making My Site Accessible10 Simple Rules for Making My Site Accessible
10 Simple Rules for Making My Site AccessibleHelena Zubkow
 
Pixlr and small apps in the classroom
Pixlr and small apps in the classroomPixlr and small apps in the classroom
Pixlr and small apps in the classroomArtfulArtsyAmy
 
Workshop 11: Trendy web designs & prototyping
Workshop 11: Trendy web designs & prototypingWorkshop 11: Trendy web designs & prototyping
Workshop 11: Trendy web designs & prototypingVisual Engineering
 
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Fwdays
 
Ten Lessons in Designing Content for Mobile
Ten Lessons in Designing Content for MobileTen Lessons in Designing Content for Mobile
Ten Lessons in Designing Content for MobileVicke Cheung
 
Aucd ppt
Aucd pptAucd ppt
Aucd ppticidemo
 
Creating a Universal Design System for Web, Mobile, Wearables, and XR
Creating a Universal Design System for Web, Mobile, Wearables, and XRCreating a Universal Design System for Web, Mobile, Wearables, and XR
Creating a Universal Design System for Web, Mobile, Wearables, and XRdamirkotoric
 
Future of Mobile Web - Coldfront conf
Future of Mobile Web - Coldfront confFuture of Mobile Web - Coldfront conf
Future of Mobile Web - Coldfront confPaul Kinlan
 
Lean Prototyping - A Practical Guide
Lean Prototyping - A Practical GuideLean Prototyping - A Practical Guide
Lean Prototyping - A Practical GuideFramebench
 
For a Social Local and Mobile Drupal
For a Social Local and Mobile DrupalFor a Social Local and Mobile Drupal
For a Social Local and Mobile DrupalAdyax
 

Similar to Week5 BA (20)

Web valley talk - usability, visualization and mobile app development
Web valley talk - usability, visualization and mobile app developmentWeb valley talk - usability, visualization and mobile app development
Web valley talk - usability, visualization and mobile app development
 
<img src="../i/r_14.png" />
<img src="../i/r_14.png" /><img src="../i/r_14.png" />
<img src="../i/r_14.png" />
 
wexarts.org iPhone Project: Developer Documentation
wexarts.org iPhone Project: Developer Documentationwexarts.org iPhone Project: Developer Documentation
wexarts.org iPhone Project: Developer Documentation
 
Introduction to Flash
Introduction to FlashIntroduction to Flash
Introduction to Flash
 
Mc635(22)
Mc635(22)Mc635(22)
Mc635(22)
 
Eye candy for your iPhone
Eye candy for your iPhoneEye candy for your iPhone
Eye candy for your iPhone
 
Responsive web design & mobile web development - a technical and business app...
Responsive web design & mobile web development - a technical and business app...Responsive web design & mobile web development - a technical and business app...
Responsive web design & mobile web development - a technical and business app...
 
Skill Session - Web Multi Device
Skill Session - Web Multi DeviceSkill Session - Web Multi Device
Skill Session - Web Multi Device
 
10 Simple Rules for Making My Site Accessible
10 Simple Rules for Making My Site Accessible10 Simple Rules for Making My Site Accessible
10 Simple Rules for Making My Site Accessible
 
Pixlr and small apps in the classroom
Pixlr and small apps in the classroomPixlr and small apps in the classroom
Pixlr and small apps in the classroom
 
Workshop 11: Trendy web designs & prototyping
Workshop 11: Trendy web designs & prototypingWorkshop 11: Trendy web designs & prototyping
Workshop 11: Trendy web designs & prototyping
 
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"
 
Ten Lessons in Designing Content for Mobile
Ten Lessons in Designing Content for MobileTen Lessons in Designing Content for Mobile
Ten Lessons in Designing Content for Mobile
 
Aucd ppt
Aucd pptAucd ppt
Aucd ppt
 
Creating a Universal Design System for Web, Mobile, Wearables, and XR
Creating a Universal Design System for Web, Mobile, Wearables, and XRCreating a Universal Design System for Web, Mobile, Wearables, and XR
Creating a Universal Design System for Web, Mobile, Wearables, and XR
 
Doran-C4L2010
Doran-C4L2010Doran-C4L2010
Doran-C4L2010
 
Future of Mobile Web - Coldfront conf
Future of Mobile Web - Coldfront confFuture of Mobile Web - Coldfront conf
Future of Mobile Web - Coldfront conf
 
Lean Prototyping - A Practical Guide
Lean Prototyping - A Practical GuideLean Prototyping - A Practical Guide
Lean Prototyping - A Practical Guide
 
For a Social Local and Mobile Drupal
For a Social Local and Mobile DrupalFor a Social Local and Mobile Drupal
For a Social Local and Mobile Drupal
 
Lean Prototyping Guide
Lean Prototyping GuideLean Prototyping Guide
Lean Prototyping Guide
 

Week5 BA

Editor's Notes